 <template>
    <!-- pages/info/info.wxml -->

    <!-- 个人信息页 -->
    <view class="wrap">
        <view class="container">
            <!-- 表单 -->
            <view class="form">
                <!-- 头像 -->
                <button class="role" @tap="onChooseAvatar">
                    <image :src="user.image" mode="" />
                </button>

                <view class="inputs">
                    <!-- 昵称 -->
                    <view class="item">
                        <view class="title">昵称</view>
                        <input type="text" :value="user.nickname" placeholder-class="placeholder-style" @input="nickname" @focus="nickname" />
                    </view>
                    <!-- 联系方式
                <view class="item">
                  <view class="title">电话</view>
                  <input type="text"  t  value="{{user.phone}}" placeholder-class="placeholder-style" bindinput="phone"/>
                </view> -->
                </view>
            </view>

            <!-- 通过微信得到 -->
            <!-- <button class="weui-btn"  bind:tap="getUserProfile">调用微信信息</button> -->

            <!-- 按钮 -->
            <view class="btn" @tap="submit">保存并提交</view>

            <text class="text">*用户提供的昵称和头像信息，仅用于提供个性化服务。我们不会收集敏感个人信息，也不会将您的个人信息用于任何与服务无关的用途。</text>
        </view>
    </view>
</template>

// <script>
// // pages/info/info.js
// import { ossConfig } from '../../config/index';
// const app = getApp();
// const util = require('../../utils/util');
// const upload = require('../../utils/upload/uploadFile');
// export default {
//     data() {
//         return {
//             user: {
//                 nickname: '',
//                 image: '',
//                 openid: '',
//                 createTime: '',
//                 updateTime: '',
//                 phone: ''
//             },
//             formattedDate: app.globalData.formattedDate
//         };
//     }
//     /**
//      * 生命周期函数--监听页面加载
//      */,
//     onLoad(options) {
//         var that = this;
//         console.log('进入个人信息页面');
//         this.setData({
//             user: uni.getStorageSync('user')
//         });
//     },
//     /**
//      * 生命周期函数--监听页面初次渲染完成
//      */
//     onReady() {},
//     /**
//      * 生命周期函数--监听页面显示
//      */
//     onShow() {},
//     /**
//      * 生命周期函数--监听页面隐藏
//      */
//     onHide() {},
//     /**
//      * 生命周期函数--监听页面卸载
//      */
//     onUnload() {},
//     /**
//      * 页面相关事件处理函数--监听用户下拉动作
//      */
//     onPullDownRefresh() {},
//     /**
//      * 页面上拉触底事件的处理函数
//      */
//     onReachBottom() {},
//     /**
//      * 用户点击右上角分享
//      */
//     onShareAppMessage() {},
//     methods: {
//         async uploadImage(path) {
//             // 上传文件到OSS

//             const _self = this;
//             uni.showLoading({
//                 title: '上传中',
//                 mask: true
//             });
//             var id = uni.getStorageSync('openid');
//             var nowTime = new Date();
//             var dir = 'headImage/' + id + '/';
//             let parseDate = app.globalData.formattedDate;
//             return upload(
//                 path,
//                 dir + parseDate + '/',
//                 function (result) {
//                     _self.setData({
//                         'user.image': result
//                     });
//                     uni.hideLoading();
//                 },
//                 function (err) {
//                     uni.hideLoading();
//                     uni.showToast({
//                         title: '上传失败',
//                         icon: 'none'
//                     });
//                 }
//             );
//         },

//         onChooseAvatar(e) {
//             uni.chooseMedia({
//                 count: 1,
//                 mediaType: ['image'],
//                 sourceType: ['album', 'camera'],
//                 sizeType: ['compressed'],
//                 success: (res) => {
//                     this.setData({
//                         'user.image': res.tempFiles[0].tempFilePath
//                     });
//                 }
//             });
//             console.log(e);
//             this.setData({
//                 'user.image': e.detail.avatarUrl
//             });
//         },

//         nickname(e) {
//             console.log(e);
//             this.setData({
//                 'user.nickname': e.detail.value
//             });
//         },

//         phone(e) {
//             this.setData({
//                 'user.phone': e.detail.value
//             });
//         },

//         // getUserProfile(){
//         //   wx.getUserProfile({
//         //     lang:'zh_CN',
//         //     desc: '用于完善用户资料',
//         //     success:(res) =>{
//         //       console.log("获取用户信息成功",res);

//         //       let user = res.userInfo;
//         //       var avatarUrl = user.avatarUrl;
//         //       var nickname = user.nickname;
//         //     }
//         //   })
//         // },
//         async submit() {
//             //上传个人信息
//             var user = this.user;

//             //判断是否填写昵称
//             if (user.nickname == '' || user.nickname == null) {
//                 uni.showToast({
//                     title: '请填写昵称',
//                     icon: 'error'
//                 });
//                 return false;
//             }
//             // //判断是否填写电话
//             // if(user.phone == '' || user.phone == null){
//             //   wx.showToast({
//             //     title: '请填写电话',
//             //     icon:'error'
//             //   })
//             //   return false;
//             // }
//             if (user.image == '' || user.image == null) {
//                 uni.showToast({
//                     title: '请上传头像',
//                     icon: 'error'
//                 });
//                 return false;
//             }
//             var image = this.user.image;
//             console.log(image);

//             //上传头像
//             if (image.indexOf('//tmp') > -1) {
//                 await this.uploadImage(image);
//             }
//             user = this.user;
//             // 是否已经注册过 设置注册时间
//             var login = uni.getStorageSync('login');
//             if (user.nickname == null) {
//                 user.createTime = app.globalData.formattedDate;
//             }
//             user.updateTime = app.globalData.formattedDate;
//             console.log(user);
//             const baseurl = app.globalData.baseurl;
//             const url = baseurl + 'User/updateInfo';
//             console.log(url);
//             uni.request({
//                 url: url,
//                 method: 'POST',
//                 header: {
//                     'content-type': 'application/JSON' //设置请求头为JSON
//                 },

//                 data: user,
//                 success: function (res) {
//                     console.log('更新个人信息接口调用成功：', user);
//                     if (res.statusCode == 200) {
//                         uni.setStorageSync('user', user);
//                         uni.setStorageSync('login', true);
//                         console.log('成功上传信息');
//                         uni.showToast({
//                             title: '保存成功',
//                             icon: 'success'
//                         });
//                         uni.navigateBack({
//                             delta: 1,
//                             success: (res) => {},
//                             fail: (res) => {},
//                             complete: (res) => {}
//                         });
//                     } else {
//                         console.log('信息上传出错');
//                         uni.showToast({
//                             title: '服务端错误，请联系管理员',
//                             icon: 'none'
//                         });
//                     }
//                 },
//                 fail: (res) => {
//                     console.log('更新个人信息接口调用失败');
//                     uni.showToast({
//                         title: '服务端错误，请联系管理员',
//                         icon: 'none'
//                     });
//                 }
//             });
//         }
//     }
// };
// </script>
<style>
/* pages/info/info.wxss */

.wrap {
    width: 100%;
    min-height: 100vh;
    background: linear-gradient(to right, #9fe1fa, #f4edc9);
}

.container {
    width: 90%;
    min-height: 100vh;
    /* background-color: yellowgreen; */
    margin: auto;
}

.form {
    width: 100%;
    min-height: 200rpx;
    background-color: rgba(255, 255, 255, 0.5);
    margin-top: 0rpx;
    position: relative;
    border-radius: 60rpx;
    box-shadow: 0 0 40rpx 10rpx rgba(0, 0, 0, 0.08);
}

.role {
    width: 300rpx;
    height: 300rpx;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -150rpx;
}
.role image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inputs {
    margin: 180rpx auto 30rpx;
}

.item {
    width: 80%;
    height: 100rpx;
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 70rpx;
    padding: 20rpx 30rpx;
    margin: 30rpx auto;
    display: flex;
    align-items: center;
}

.item input {
    flex: 1;
    height: 80rpx;
    border: 1px solid rgba(255, 163, 115, 0.5);
    border-radius: 40rpx;
    padding-left: 30rpx;
}

.title {
    padding-right: 30rpx;
    padding-left: 20rpx;
}

.btn {
    width: 90%;
    height: 110rpx;
    background-image: linear-gradient(90deg, #ffc77f, #ff7c62);
    border-radius: 55rpx;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    margin: 70rpx auto;
    box-shadow: 0 0 40rpx 10rpx rgba(0, 0, 0, 0.08);
}

.text {
    color: rgb(194, 189, 189);
    font-size: 35rpx;
}
</style */>
